import Vue from 'vue';
import Vuex from 'vuex';
import createPersistedState from "vuex-persistedstate"

Vue.use(Vuex);
let state = {
  isLogin:0,
  userInfo:{}
}
const stateDark = {
  theme:2,
  userInfo: null,
  bgColor: 'black',
  color: "#fff",
  main_bc_color:"#000",
  item_bc: "rgb(38, 41, 47)",
  reviewSearchBgColor: "#26292f",
  ain_bc_color: '#000',
  nav_bc: '#000',
  main_bc_opacity: 'rgba(0,0,0,0.3)',
  main_bc_0_8: 'rgba(0,0,0,0.8)',
  main_color_0_1: 'hsla(0,0%,100%,0.2)',
  main_color_0_1_1: 'hsla(0,0%,100%,0.1)',
  main_bc_invert: '#fff',
  content_bc: '#26292f',
  sub_color: '#242424',
  text_color: '#fff',
  dm_bc: 'rgba(0,0,0,0.5)',
  price_border: '#444',
  menu_color: "#fff",
  unboxing_im_bc: "rgb(27,27,27)",
  menu_d_bg: '#15191c',
  menu_border: "#000",
  pop_bg:'/static/img/box/open_bc_dark.png',
  bc_svg:'/static/img/main/bc.svg',
  tab_bc:"rgb(38, 41, 47)",
  battle_card_bc:'#2f364d',

  box_content_bc:'#1f2643',
  watch_btn_bc:'#38405c',
};
const stateLight = {
  theme:1,
  userInfo: null,
  bgColor: 'rgb(254,254,254)',
  color: "#000",
  main_bc_color: '#f2f2f2',
  reviewSearchBgColor: "#fff",
  item_bc: "#fff",
  nav_bc: '#fff',
  main_bc_opacity: 'hsla(0,0%,100%,0.3)',
  main_bc_0_8: 'hsla(0,0%,100%,0.8)',
  main_color_0_1: 'rgba(0,0,0,0.2)',
  main_color_0_1_1: 'rgba(0,0,0,0.1)',
  main_bc_invert: '#333',
  content_bc: '#fff',
  sub_color: '#f2f2f2',
  text_color: '#333',
  dm_bc: 'rgba(0,0,0,0.5)',
  price_border: '#c9c9c9',
  menu_color: "rgb(51, 51, 51)",
  unboxing_im_bc: "#fff",
  menu_d_bg: '#fff',
  menu_border: "#f2f2f2",
  pop_bg:'/static/img/box/open_bc.png',
  bc_svg:'/static/img/main/bc-white.svg',
  tab_bc:"#fff",
 
  battle_card_bc:'#fff',

  box_content_bc:'#e8e8eb',
  watch_btn_bc:'#f6f6f8',

};
// state = stateCopy
 state = Object.assign(state,stateDark)

const getters = {};



const mutations = {
  setUserInfo(state, data) {
    state.userInfo = data;

    
  },
  
  setIsLogin(state, data) {
    state.isLogin = data;
  },
  setColor(state, data) {
    let modSTatus ={}
    if (data == 1) {
      modSTatus =stateLight
      state.nav_bc=  '#fff'
      state.content_bc=  '#fff'
      //state.theme = 1
    } else if (data == 2) {
      // state = {...stateDark}
      modSTatus =stateDark
      state.nav_bc=  '#000'
      state.content_bc=  '#26292f'
      
    }
    Object.keys(modSTatus).forEach(k=>{
      state[k]=modSTatus[k]
    })
    
  },
};

const actions = {};

const store = new Vuex.Store({
  state,
  mutations,
  actions,
  /* vuex数据持久化配置 */
  plugins: [
    createPersistedState()]
})
// store.watch(
//   state=>state,
//   val=>{
//     localStorage.setItem("vuex",JSON.parse(val))
//   },{
//     deep:true
//   }
// )


export default store;
